<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<%@taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>

<html>
	<head>
		<meta name="viewport" content="maximum-scale=1.0,minimum-scale=1.0,user-scalable=0,width=device-width,initial-scale=1.0" />
		<meta name="format-detection" content="telephone=no, email=no, date=no, address=no">
		<meta name="apple-mobile-web-app-capable" content="yes">
		<meta http-equiv="Pragma" content="no-cache">
		<meta name="apple-mobile-web-app-status-bar-style" content="black">
		<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
		<meta http-equiv="X-UA-Compatible" content="IE=edge,chrome=1">
		<meta name="format-detection" content="telephone=no" />
		<meta name="apple-mobile-web-app-capable" content="yes" />
		<meta content="black" name="apple-mobile-web-app-status-bar-style">
		<link href="css/bksystem.css" rel="stylesheet" type="text/css" />
		<link href="font/iconfont.css" rel="stylesheet" type="text/css" />
		<link href="css/module.css" rel="stylesheet" type="text/css" />
		<link href="css/pages.css" rel="stylesheet" type="text/css" />
		<title>小吃管理</title>
		<script src="js/jquery-1.9.1.min.js" type="text/javascript"></script>
		<script src="js/jquery.nicescroll.js" type="text/javascript"></script>
		<script src="js/HUpages.js" type="text/javascript"></script>
		<script src="js/template.js" type="text/javascript"></script>
		<!--[if lt IE 9]>
          <script src="js/html5shiv.js" type="text/javascript"></script>
          <script src="js/css3-mediaqueries.js"  type="text/javascript"></script>
        <![endif]-->
		<style>
			body {
				font-family: Arial, sans-serif;
				background-color: #F5F5F5;
				margin: 0;
				padding: 20px;
				height: 100%;
			}

			h1 {
				font-weight: bold;
				color: #333;
				margin-bottom: 30px;
			}

			form {
				margin-bottom: 20px;
			}

			label {
				display: inline-block;
				width: 120px;
				text-align: right;
				margin-right: 10px;
				font-weight: bold;
				font-size: 20px;
			}

			input[type="text"],
			select {
				padding: 5px;
				border: 1px solid #999;
				border-radius: 3px;
			}

			input[type="submit"],
			input[type="button"] {
				padding: 8px 16px;
				font-weight: bold;
				background-color: #007BFF;
				color: #FFF;
				border: none;
				border-radius: 3px;
				cursor: pointer;
			}

			table {
				width: 100%;
				border-collapse: collapse;
			}

			th, td {
				padding: 8px;
				border-bottom: 1px solid #DDD;
				text-align: center;
			}

			th {
				background-color: #f2f2f2;
				font-weight: bold;
			}

			tr:nth-child(even) {
				background-color: #f9f9f9;
			}

			.error-message {
				color: red;
				font-weight: bold;
				margin-top: 10px;
			}
			#xj{
				width: 140px;
				height: 100px;
			}
			body {
				overflow-y: scroll;
			}
		</style>
	</head>
	<body>
	<h1>菜品管理</h1>
		<label for="name">小吃名称：</label>
		<input type="text" name="name" id="name">
		<input type="button" value="搜索" onclick="searchSnacks()">


		<div style="text-align: right;">
			<input type="button" value="新建菜品"onclick="window.location.href='snacksTj.jsp';">
		</div>
		<table>
			<thead>
			<tr>
				<th>菜品名称</th>
				<th>图片</th>
				<th>菜品描述</th>
				<th>菜品价格</th>
				<th>优惠价格</th>
				<th>菜品特性</th>
				<th>菜品日期</th>
				<th>售卖状态</th>
				<th>修改状态</th>
				<th>是否推荐</th>
				<th>操作</th>
			</tr>
			</thead>
			<tbody>
			</tbody>


		</table>

	   <div id="pageDiv">
	   </div>
		<script>
			function del(idStr) {

				var result = confirm("确认删除这份小吃吗?");
				if (result) {
					$.ajax({
						url: "ServletDelete",
						type: "post",
						data: "snacksld=" + idStr,
						success: function (temp) {
							if (parseInt(temp) > 0) {
								alert("删除成功");
								location.reload();
							} else {
								alert("删除失败!");
							}
						}
					})
				}
			}
			function upa(idStr) {

				var result = confirm("确认下架这份小吃吗?");
				if (result) {
					$.ajax({
						url: "ServletUpdateSelf",
						type: "post",
						data: "snacksld=" + idStr,
						success: function (temp) {
							if (parseInt(temp) > 0) {
								alert("下架成功");
								location.reload();
							} else {
								alert("下架失败!");
							}
						}
					})
				}
			}
			//上架
			function upaTop(idStr) {

				var result = confirm("确认上架这份小吃吗?");
				if (result) {
					$.ajax({
						url: "ServletUpadateTopSelf",
						type: "post",
						data: "snacksld=" + idStr,
						success: function (temp) {
							if (parseInt(temp) > 0) {
								alert("上架成功");
								location.reload();
							} else {
								alert("上架失败!");
							}
						}
					})
				}
			}
			//上推荐
			function upaTj(idStr) {

				var result = confirm("确认推荐这份小吃吗?");
				if (result) {
					$.ajax({
						url: "ServletUpadateTopTJ",
						type: "post",
						data: "snacksld=" + idStr,
						success: function (temp) {
							if (parseInt(temp) > 0) {
								alert("推荐成功");
								location.reload();
							} else {
								alert("推荐失败!");
							}
						}
					})
				}
			}
			//下推荐
			function upaNoTj(idStr) {

				var result = confirm("确认要下推这份小吃吗?");
				if (result) {
					$.ajax({
						url: "ServletUpadateTJ",
						type: "post",
						data: "snacksld=" + idStr,
						success: function (temp) {
							if (parseInt(temp) > 0) {
								alert("下推成功");
								location.reload();
							} else {
								alert("下推失败!");
							}
						}
					})
				}
			}


			function searchSnacks() {
				var name = $("#name").val();
				if (name!=""){
					var  dizhi="ServletLoginLike";
					$.ajax({
						url: dizhi,
						type: "post",
						data: {name: name},
						dataType: "json",
						success: function(data) {
							var tbodyStr = "";
							$(data).each(function(index, item) {
								tbodyStr += '  <tr>' +
										'        <td>' + item.snacksName + '</td>' +
										'        <td><img src="https://liualing.oss-cn-guangzhou.aliyuncs.com/' + item.tupian + item.houzui + '" id="xj"/></td>' +
										'        <td>' + item.snacksPtion + '</td>' +
										'        <td>' + item.snacksPrice+ '</td>' +
										'        <td>' + item.snacksYhPrice + '</td>' +
										'        <td>' + item.snackFeature + '</td>' +
										'        <td>' + item.snackTime + '</td>';
								if (item.shelf === 1) {
									tbodyStr += '<td>已上架</td>'
								} else if (item.shelf === 0) {
									tbodyStr += '<td>已下架</td>'
								}
								if (item.recommend === 1) {
									tbodyStr += '<td>已推荐</td>' +
											'        <td><a onclick="upaNoTj(\'' + item.snacksld + '\')">下推荐</a>\t\t<a onclick="del(\'' + item.snacksld + '\')">删除</a></td>';
								} else if (item.recommend === 0) {
									tbodyStr += '<td>未推荐</td>' +
											'        <td><a onclick="upaTj(\'' + item.snacksld + '\')">推荐</a>\t\t<a onclick="del(\'' + item.snacksld + '\')">删除</a></td>';
								}

								tbodyStr += '      </tr>';
							});
							$("tbody").html(tbodyStr);


						}
					});
				}else {
					location.reload();
				}
			}

			var page = 1; //页数
			var pageCount = 1;//总页数
			<!--  下页  -->
			function toNext(){
				page++;
				changePage();
			};
			<!--  上页  -->
			function toBack(){
				page--;
				changePage();
			};
			<!--  首页  -->
			function toHead(){
				page=1;
				changePage();
			};
			<!--  尾页  -->
			function toEnd(){
				page=pageCount;
				changePage();
			};

			<!--  尾页  -->
			function toPage(pageIndex){
				page=pageIndex;
				changePage();
			};

			function changePage(){
				var urlStr = "ServletLogin";
				$.ajax({
					url:urlStr,
					data:{"page" : page},
					dataType:'json',
					success: function(data) {
						var tbodyStr = "";
						console.log(data);
						$(data.resultList).each(function(index, item) {
							tbodyStr += '  <tr>' +
									'        <td>' + item.snacksName + '</td>' +
									'        <td><img src="https://liualing.oss-cn-guangzhou.aliyuncs.com/' + item.tupian + item.houzui + '" id="xj"/></td>' +
									'        <td>' + item.snacksPtion + '</td>' +
									'        <td>' + item.snacksPrice+ '</td>' +
									'        <td>' + item.snacksYhPrice + '</td>' +
									'        <td>' + item.snackFeature + '</td>' +
									'        <td>' + item.snackTime + '</td>';
							if (item.shelf === 1) {
								tbodyStr += '<td>已上架</td>' +
										'        <td><a onclick="upa(\'' + item.snacksld + '\')">下架</a></td>';
							} else if (item.shelf === 0) {
								tbodyStr += '<td>已下架</td>' +
										'        <td><a onclick="upaTop(\'' + item.snacksld + '\')">上架</a></td>';
							}
							if (item.recommend === 1) {
								tbodyStr += '<td>已推荐</td>' +
										'        <td><a onclick="upaNoTj(\'' + item.snacksld + '\')">下推荐</a>\t\t<a onclick="del(\'' + item.snacksld + '\')">删除</a></td>';
							} else if (item.recommend === 0) {
								tbodyStr += '<td>未推荐</td>' +
										'        <td><a onclick="upaTj(\'' + item.snacksld + '\')">推荐</a>\t\t<a onclick="del(\'' + item.snacksld + '\')">删除</a></td>';
							}
							tbodyStr += '      </tr>';

						});

						$("tbody").html(tbodyStr);

						pageCount=data.pageCount;
						var pageInfo="";
								if(page==1){
									pageInfo+="  <button id=\"first_page\" disabled>首页</button>\n";
								}else{
									pageInfo+="  <button id=\"first_page\" onclick='toHead()'>首页</button>\n";
									pageInfo+="\t\t<button id=\"pre_page\" onclick='toBack()'> < </button>\n" ;
								}


								for (var i =1; i <= pageCount ; i++){
									if(i==page){
										pageInfo+="\t\t<font th:text=\"${pageCount}\" id=\"page_all\" style='color:red;'>"+i+"</font>\n" ;
									}else{
										pageInfo+="\t\t<font th:text=\"${pageCount}\" id=\"page_all\" onclick='toPage("+i+")'>"+i+"</font>\n" ;
									}

								}
								if(page ==pageCount){
									pageInfo+="\t\t<button id=\"tail_page\" disabled>尾页</button>";
								} else{
									pageInfo+="\t\t<button id=\"pre_page\" onclick='toNext()'> > </button>\n" ;
									pageInfo+="\t\t<button id=\"tail_page\" onclick='toEnd()'>尾页</button>";
								}
							$("#pageDiv").html(pageInfo);

					}
				});
			};
			changePage();
		</script>
	</body>
</html>